.podcast-cover-image-setting__preview {
	position: relative;
	display: flex;
	float: left;
	margin: 0;
	text-align: center;
	border: 1px solid var( --color-neutral-10 );
	cursor: pointer;
	height: 96px;
	width: 96px;

	&.is-transient .spinner {
		position: absolute;
		top: 0;
		right: 0;
		bottom: 0;
		left: 0;
		background-color: rgba( var( --color-surface-rgb ), 0.75 );
	}
}

.podcast-cover-image-setting__img {
	align-self: center;
	background: rgba( var( --color-surface-rgb ), 0 );
	position: relative;
	max-height: 100%;
	max-width: 100%;
	margin: 0 auto;

	.is-disabled & {
		opacity: 0.3;
	}
}

.podcast-cover-image-setting__placeholder {
	color: var( --color-text-subtle );
	display: block;
	font-size: 13px;
	font-style: italic;
	font-weight: 400;
	margin: 0 7px;
	text-align: center;
	align-self: center;

	.is-disabled & {
		color: var( --color-neutral-20 );
	}
}

.podcast-cover-image-setting {
	width: 208px;

	@include breakpoint( '>960px' ) {
		width: 98px;
	}
}

.podcast-cover-image-setting__button {
	width: 98px;
	float: left;
	margin: 0 0 6px 12px;
	text-align: center;

	.is-disabled &:disabled {
		background-color: var( --color-neutral-0 );
		border-color: var( --color-neutral-10 );
		color: var( --color-neutral-20 );
	}

	@include breakpoint( '>960px' ) {
		margin: 6px 0 0;
	}
}